<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!-- public quote -->
<%@include file="/jsp/comm_css_include.jsp"%>
<!-- jqgrid-->
<link href="${basePath}/css/plugins/jqgriddemo/css/ui.jqgrid-bootstrap.min.css" rel="stylesheet" />
<!doctype html>
<html>
<head>
	<style type="text/css">
	   *{
	      margin: 0px;
	      padding: 0px;
	      font-size: 12px;
	   }
	</style>
</head>
<body class="gray-bg">
<div class="creditbody">
	    <div class="iboxtitle">
	        <span><i class="glyphicon glyphicon-map-marker"></i>&nbsp;业务受理 >业务申请 >增加配偶或担保人</span>
	    </div>
	   <div class="ibox-content ibox-zxsearchqu ">
	        <div class="row">
	            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-3">
		           	 <div class="row">
		           	 	<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">  
		             	   <label class="sr-only">客户名：</label>
		                 <input type="text" placeholder="客户名" id="customerName" name="customerName" class="form-control">
		               </div>
		               <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">  
		                 <label class="sr-only">业务员：</label>
		                 <input type="text" placeholder="业务员" id="salesmanName" name="salesmanName" class="form-control">
		                </div> 
		             </div>     
	            </div>
	            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-2">
		            <select class="select-control" id="bankName" name="bankName">
		             	<input type="hidden" id="bankText"/>
		             </select>
	             </div>
	            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-3">
	            	 <div class="row">
	            			<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">  
	            				<input id="submitTimeStart" name="submitTimeStart" placeholder="开始时间" class="laydate-icon form-control">
	            			</div>
	            			<label class="hxleft">至</label>
		                  <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">  
		                  		<input id="submitTimeEnd" name="submitTimeEnd" placeholder="结束时间" class="laydate-icon form-control">
		                  </div>
	                 </div>
	             </div>
	             <div class="col-sm-12 col-sm-12 col-md-12 col-lg-4">
		              <button type="button" class="btn dpbtn_blue_null" onclick="query(0,0);">当日</button>
		              <button type="button" class="btn dpbtn_blue_null" onclick="query(-1,-1);">昨日</button>
		              <button type="button" class="btn dpbtn_blue_null" onclick="query(-6,0);">近7日</button>
		              <button type="button" class="zhixcx" onclick="query();">执行查询</button>
	         	</div>
	   		</div>
	   </div>
	   <div class="ibox-content">
	   		<span class="warning-label"><span class="red-dp-circle"></span>提交初审之前的订单信息</span>	
	     	<div class="jqGrid_wrapper">
	         <table id="table_list_1"></table>
	         <div id="pager_list_1"></div>
	    	</div>
	   </div>
   
  	   <!-- 列隐藏 -->
	   <div class="ibox-content" id="hideName" name="hideName" style="display: none;">
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox" checked="checked" name="chName" value="name" onclick="chNameOnclick();"><i></i> 部门
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox" checked="checked" name="chName" value="creatorName" onclick="chNameOnclick();"><i></i> 业务员
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox" checked="checked" name="chName" value="cusName" onclick="chNameOnclick();"><i></i> 客户姓名
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox" checked="checked" name="chName" value="creditPeopleType" onclick="chNameOnclick();"><i></i> 角色
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox" checked="checked" name="chName" value="cusNo" onclick="chNameOnclick();"><i></i> 身份证号码
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox" checked="checked" name="chName" value="bankCode" onclick="chNameOnclick();"><i></i> 银行
                </label>
            </div>
		</div>
		
		<!-- 排序 -->
		<div class="ibox-content" id="hideDescName" name="hideDescName" style="display: none;">
			<div class="m-l m-r-xs" style="color: #DA242A;">
				默认按业务提交时间反序
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="radio" name="radioName" value="asc" onclick="chNameDescOnclick();"><i></i> 正序
                </label>
                <label class="i-checks">
                   <input type="radio" name="radioName" checked="checked" value="desc" onclick="chNameDescOnclick();"><i></i> 反序
                </label>
            </div>
            <hr/>
			<div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox" checked="checked" name="chDescName" value="t.created" onclick="chNameDescOnclick();"><i></i> 业务提交时间
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox"  name="chDescName" value="e.org_name" onclick="chNameDescOnclick();"><i></i> 部门
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox"  name="chDescName" value="p.`name`" onclick="chNameDescOnclick();"><i></i> 业务员
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox"  name="chDescName" value="t.cus_name" onclick="chNameDescOnclick();"><i></i> 客户姓名
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox" name="chDescName" value="t.credit_people_type" onclick="chNameDescOnclick();"><i></i> 角色
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox" name="chDescName" value="t.cus_no" onclick="chNameDescOnclick();"><i></i> 身份证号码
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox" name="chDescName" value="t.bank_code" onclick="chNameDescOnclick();"><i></i> 银行
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox"  name="chDescName" value="t.created" onclick="chNameDescOnclick();"><i></i> 创建时间
                </label>
            </div>
            <div class="checkbox m-l m-r-xs">
                <label class="i-checks">
                   <input type="checkbox"  name="chDescName" value="t.modified" onclick="chNameDescOnclick();"><i></i> 修改时间
                </label>
            </div>
            <div class="checkbox m-l m-r-xs" style="float: right;">
            	<a class="dpbtn_blue_height" onclick="paixu();">确定</a>
            </div>
		</div>
		
		<!-- 统计 -->
		<div class="ibox-content" id="line-chart" name="line-chart" style="display: none;">
			<div class="m-l m-r-xs" style="color: #DA242A;">
				注意：这里统计主借人有多少担保人和配偶，取最近10天数据
            </div>
			<div class="ibox-content">
				<div class="echarts" id="echarts-bar-chart" style="height: 200px;"></div>
			</div>
			<div class="ibox-content">
				<div class="echarts" id="echarts-pie-chart" style="height: 200px;"></div>
			</div>
		</div>
</div>

	<!-- public quote -->
    <%@include file="/jsp/comm_js_include.jsp"%>
	<!-- jqGrid -->
    <script type="text/javascript" charset="utf-8" src="${basePath}/js/plugins/jqgriddemo/js/jquery.jqGrid.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="${basePath}/js/plugins/jqgriddemo/js/grid.locale-cn.min.js"></script>
    <!-- layerDate plugin javascript -->
    <script src="${basePath}/js/plugins/layer/laydate/laydate.js"></script>
    <!-- echarts -->
	<%@include file="/js/common-dpqc/dpqc-echarts/comm_echarts_include.jsp"%>


	<script type="text/javascript">

	var winWidth = $(window).width();
	var winHeight = $(window).height();

	jQuery(function($){
		
	    laydate({
	        elem: '#submitTimeStart',
	        event: 'focus'
	    });

	    laydate({
	        elem: '#submitTimeEnd',
	        event: 'focus'
	    });

		getData();
	});

    var getData = function()
    {
      var winWidth = $('div.ibox-content').width();
      var winHeight = document.body.offsetHeight - 380;
      var win = winWidth / 7 - 10;
      var createdWidth = win;
      if(createdWidth < 180)
      {
    	  createdWidth = 180;
      }
	  $.jgrid.defaults.styleUI = 'Bootstrap';
	  jQuery("#table_list_1").jqGrid
	  ({
			url:'${basePath}/QueryEntryController/diepuQueryEntry?modeIdName=creditApplyAddList',
	        datatype : "json",
	        colNames : [ 'replaceId','tid','hid', '业务提交时间','部门','业务员','客户姓名', '角色', '身份证号码', '银行'],
	        colModel : [
	                     {name: 'replaceId', index: 'id', hidden:true,sortable: false},
	                     {name: 'tid', index: 'tid', hidden:true,sortable: false},
	                     {name: 'hid', index: 'hid', hidden:true,sortable: false},
	                     {name: 'created',index: 'created',width: createdWidth,align: "center",sortable: false},
	                     {name: 'name',index: 'created',width: win,align: "center",sortable: false},
	                     {name: 'creatorName',index: 'created',width: win,align: "center",sortable: false},
	                     {name: 'cusName',index: 'created',width: win,align: "center",sortable: false},
	                     {name: 'creditPeopleType',index: 'created',width: win,align: "center",sortable: false,
	                    	 formatter: function (cellvalue, options, rowObject) 
	                    	 {
	                    		 if(cellvalue == "01")
	                    		 {
	                    			 return "配偶";
	                    		 }
	                    		 
	                    		 if(cellvalue == "02")
	                    		 {
	                    			 return "担保人";
	                    		 }
	                    		 
	                    		 if(cellvalue == "03")
	                    		 {
	                    			 return "主借人";
	                    		 }
	                    	 }	 
	                     },
	                     {name: 'cusNo',index: 'created',width: win,align: "center",sortable: false},
	            		 {name: 'bankCode',index: 'created',width: win,align: "center",sortable: false}
	                   ],
	          mtype : "post",
	          height: winHeight,
	          width:winWidth,  
	          shrinkToFit:false,
	          autoScroll: false,
	          rowNum: 15,
	          rowList: [15, 30, 45],
	          viewrecords: true,
	          pager: "#pager_list_1",
	          hidegrid: false,
	          multiselect : false,
	          altRows:true,
	          altclass:'someClass',
	          footerrow:true,
	          ondblClickRow:function(rowId)
	          {
	        	  var row = $("#table_list_1").jqGrid("getRowData",rowId);
	        	  $.dpAjax({
	      	   		url:'${basePath}/YwShenQingZxController/getBusiness',
	      	   		data:{"queryCreditApplyId":row.tid},
	      			success: function(datas)
	      			{
	      		 	  if(datas.flag == "100100")
	      		 	  {
	      		 		  var result = datas.result;
	      		 		  if(result)
	      		 		  {
	      		 			  if(result.busiStatus > 30)
	      		 			  {
	      		 				  layer.msg("只允许添加未提交初审的客户，已提交的客户请先退回!", {icon: 5});
	        		 			  return;
	      		 			  }
	      		 		  }
	      	        	  window.location.href = "${basePath}/YwShenQingZxView/CreditApplyAdd?id="+row.tid+"&tid="+row.replaceId+"&hid="+row.hid+"&creditPeopleType="+row.creditPeopleType
	      				  return;
	      			  }
	      			  layer.msg(datas.message, {icon: 2});
	      			}
	      	   	});  
			  },
	          jsonReader : {
	        	  root:"result.rows",
	        	  page: "result.page",
	        	  total: "result.total",
	        	  records: "result.records",
	        	  repeatitems: false,
	        	  id: "replaceId"
	          },
	          loadComplete:function(datas)
	          {
	        	  if (datas.flag == "100100") 
	        	  {
	                  layer.msg("查询成功!", {icon: 6, time: 1000});
	                  if($('#bankText').val() == "")
	                  {
	                	  var loanBank = datas.loanBank;
	                      var objs = '';
	                      for(var key in loanBank)
	                      {
	                    	  objs += '<option value="'+key+'">'+loanBank[key]+'</option>';
	                      }
	                      $('#bankName').html(objs);
	                      $('#bankText').val(objs);
	                  }
	                  return;
	              }
	        	  if(datas.flag == '100802') 
	        	  {
	 				  top.location.href = thisLoginUrl;
	 				  return;
	 			  }
	              layer.msg(datas.message, {icon: 2});
	          },
	          gridComplete:function(row)
	          {
	        	  var ids = $("#table_list_1").getDataIDs();
	        	  if(ids && ids.length > 0)
	        	  {
	        		  var datas = 
	        		  {
	        			 'created':'<a class="dpbtn_blue_height"  onclick="shenxuan();" style="width:200px;">显示</a>  <a class="dpbtn_blue_height" onclick="shenxuanDesc();">排序</a>  <a class="dpbtn_blue_height" onclick="tongji();">统计</a>'
	        		  };
	        		  $('#table_list_1').footerData("set", datas);
	        	  }
	          }
       });
    }

    window.onresize = function()
    {
    	$("#table_list_1").setGridWidth($(window).width()-80);
    }

    var refresh = function()
    {
    	$("#table_list_1").jqGrid("setGridParam", { search: true }).trigger("reloadGrid", [{ page: 1}]);
    }
    
    
    //查询
    var query = function(start,end)
    {
    	if(start != null && typeof start != 'undefined') 
    	{
    		document.getElementById('submitTimeStart').value = laydate.now(start);
    		document.getElementById('submitTimeEnd').value = laydate.now(end);
    	} 
    	var postData = $("#table_list_1").jqGrid("getGridParam", "postData");
    	var customerName = document.getElementById('customerName').value || '';
    	var salesmanName = document.getElementById('salesmanName').value || '';
    	var bankName = document.getElementById('bankName').value || '';
    	if(start != 0 && !start)
    	{
    		document.getElementById('submitTimeStart').value = "";
    		document.getElementById('submitTimeEnd').value = "";
    	}
    	var submitTimeStart = document.getElementById('submitTimeStart').value || '';
    	var submitTimeEnd = document.getElementById('submitTimeEnd').value || '';
    	$.extend(postData,{"customerName":customerName.trim(),"salesmanName":salesmanName,"bankName":bankName,"submitTimeStart":submitTimeStart,"submitTimeEnd":submitTimeEnd});
    	refresh();
    }
    
    var shenxuan = function()
    {
    	var hideName = $('#hideName');
    	layer.open({
    	  type: 1,
    	  area: ['220px'],
    	  skin: 'layui-layer-lan', 
    	  shadeClose: false, 
    	  content: hideName
    	});
    }
    
    var chNameOnclick = function()
    {
    	var objs = document.getElementsByName("chName");
    	if(objs && objs.length > 0)
    	{
    		for(var i=0;i<objs.length;i++)
    		{
    			if(objs[i].checked == false)
    			{
    				var value = objs[i].value;
    				jQuery("#table_list_1").jqGrid('hideCol', [value]);
    			}
    			else
    			{
    				var value = objs[i].value;
    				jQuery("#table_list_1").jqGrid('showCol', [value]);
    			}
    		}
    	}
    }
    
    var shenxuanDesc = function()
    {
    	var hideDescName = $('#hideDescName');
    	layer.open({
    	  type: 1,
    	  area: ['220px'],
    	  skin: 'layui-layer-lan', 
    	  shadeClose: false, 
    	  content: hideDescName
    	});
    }
    
    var paixu = function()
    {
    	var sqlXmls = "";
    	var data = {};
    	var objs = document.getElementsByName("chDescName");
    	if(objs && objs.length > 0)
    	{
    		for(var i=0;i<objs.length;i++)
    		{
    			if(objs[i].checked)
    			{
    				sqlXmls += objs[i].value + ",";
    			}
    		}
    		if(sqlXmls != "")
    		{
    			sqlXmls = sqlXmls.substring(0,sqlXmls.length - 1);
    			
    			var radio = document.getElementsByName("radioName");
	    		if(radio && radio.length > 0)
	    		{
	    			for(var i=0;i<radio.length;i++)
	    			{
	    				if(radio[i].checked)
		    			{
		    				sqlXmls += " " +radio[i].value;
		    			}
	    			}
	    		}
    		}
    	}
    	var postData = $("#table_list_1").jqGrid("getGridParam", "postData");
    	$.extend(postData, {"orderSql":sqlXmls});
    	refresh();
    	layer.closeAll();
    }
    
    var tongji = function()
    {
    	var modeId = $.getUrlData('modeId');
    	$.dpAjax({
 			url:'${basePath}/FengKongShenHeController/getStatistics',
 			data:{modeIdType:"zengJiaPeiOuDanBaoRen"},
 			success: function(datas)
 			{
 				  if(datas.flag == "100100")
 				  {
 					  var resultCreditPeopleTypeCount = datas.resultCreditPeopleTypeCount;
 					  if(resultCreditPeopleTypeCount)
 					  {
 						    var winWidth = $(window).width();
 				    	    var winHeight = $(window).height();
 				    	    var line_chart = $('#line-chart');
	 				    	layer.open({
	 				    	  type: 1,
	 				    	  area: [(winWidth/2)+'px'],
	 				    	  skin: 'layui-layer-lan', 
	 				    	  shadeClose: false, 
	 				    	  content: line_chart
	 				    	});
	 				    	
	 				    	var dataKey = [];
	 				    	var data = [];
	 				    	var length = 15;
	 				    	if(resultCreditPeopleTypeCount.length <= 15)
	 				    	{
	 				    		 length = resultCreditPeopleTypeCount.length;
	 				    	}
	 				    	for(var i=0;i<length;i++)
	 				    	{
	 				    		dataKey.push(resultCreditPeopleTypeCount[i].cus_name);
	 				    		data.push(resultCreditPeopleTypeCount[i].credit_people_type_count);
	 				    	}
	 				    	
	 				    	var dataValue = [
	   	    	                {
	   	    	                      name:'角色维度',
	   	    	                      type:'bar',
	   	    	                      data:data,
	   	    	                      markPoint : {
	   	    	                          data : [
	   	    	                              {type : 'max', name: '最大值'},
	   	    	                              {type : 'min', name: '最小值'}
	   	    	                          ]
	   	    	                      },
	   	    	                      markLine : {
	   	    	                          data : [
	   	    	                              {type : 'average', name: '平均值'}
	   	    	                          ]
	   	    	                      }
	   	    	                }
   	    	              ];
	 				    	
	 				      
 				    	  $.fn.barChart({
	 				    		"id":"echarts-bar-chart", 
	 							"text":"", 
	 							"categories":['角色维度'], 
	 							"formatter":"", 
	 							"dataKey":dataKey,
	 							"dataValue":dataValue 
 				    	  });
 				    	  
 				    	  var categories = [];
 				    	  var data = [];
 				    	  var length = 10;
 				    	  if(resultCreditPeopleTypeCount.length <= 10)
 				    	  {
 				    		 length = resultCreditPeopleTypeCount.length;
 				    	  }
 				    	  for(var i=0;i<length;i++)
 				    	  {
 				    		 categories.push(resultCreditPeopleTypeCount[i].cus_name);
 				    		 var objs = {};
 				    		 objs.value = resultCreditPeopleTypeCount[i].credit_people_type_count;
 				    		 objs.name = resultCreditPeopleTypeCount[i].cus_name;
 				    		 data.push(objs);
 				    	  }
 				    	  
 				    	  var dataValue =  [
  		          	            {
  		        	                name:'角色维度',
  		        	                type:'pie',
  		        	                radius : '55%',
  		        	                center: ['50%', '60%'],
  		        	                data:data
  		        	            }
  	        	          ];
 				    	  
 				    	  $.fn.pieChart({
 				    		 "id":"echarts-pie-chart",   
 							 "text":"",		  
 							 "subtext":"角色维度",   		
 							 "formatter":"{a} <br/>{b} : {c} ({d}%)",  
 							 "categories":categories, 
 							 "dataValue":dataValue,  
 							 "legendx":"left", 
 				    	 });
 					  }
 					  return;
 				  }
 				  layer.msg(datas.message, {icon: 5});
 		     }
	    });
    }
</script>
</body>
</html>
